<template>
    <a-card :bordered="false">
        <!-- 查询区域 -->
        <div class="table-page-search-wrapper">
            <a-form layout="inline" @keyup.enter.native="searchQuery">
                <a-row :gutter="24">
                    <a-col :md="6" :sm="8">
                        <a-form-item label="成果编号">
                            <a-input placeholder="请填写成果编号" v-model="queryParam.cxj_xmbh"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="成果名称">
                            <a-input placeholder="请填写成果名称" v-model="queryParam.cxj_mc_zw"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="申报单位">
                            <a-input placeholder="请填写申报单位" v-model="queryParam.sbdw_qymc"></a-input>
                        </a-form-item>
                    </a-col>
                    <a-col :md="6" :sm="8">
                        <a-form-item label="推荐状态">
                            <a-select v-model="queryParam.tj_zt" placeholder="请选择推荐状态">
                                <!-- <a-select-option value="">请选择</a-select-option>
                                <a-select-option value="200">待推荐</a-select-option>
                                <a-select-option value="201">退回修改</a-select-option>
                                <a-select-option value="204">退回修改已提交</a-select-option>
                                <a-select-option value="203">已推荐</a-select-option>
                                <a-select-option value="202">不推荐</a-select-option> -->
                                <a-select-option value="">请选择</a-select-option>
                                <a-select-option value="200">待推荐</a-select-option>
                                <a-select-option value="203">已推荐</a-select-option>
                                <a-select-option value="202">不推荐</a-select-option>
                                <a-select-option value="201">退回修改</a-select-option>
                                <a-select-option value="204">退回修改已提交</a-select-option>
                            </a-select>
                        </a-form-item>
                    </a-col>

                    <a-col :md="6" :sm="8">
                        <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                            <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                            <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
                        </span>
                    </a-col>
                </a-row>
            </a-form>
        </div>
        <!-- 查询区域-END -->

        <!-- 操作按钮区域 -->
        <div class="table-operator">
            <!-- <span>2020年度电力创新奖项目推荐表，当前状态：未上传</span>
            <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
                <a-button type="primary" icon="upload">上传</a-button>
            </a-upload>
            <a-button type="primary" icon="download" @click="handleExportXls('成果推荐表')">导出Excel</a-button> -->





            <!-- <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button> -->
            <!-- 高级查询区域 -->
            <!-- <j-super-query :fieldList="superFieldList" ref="superQueryModal" @handleSuperQuery="handleSuperQuery"></j-super-query>
            <a-dropdown v-if="selectedRowKeys.length > 0">
                <a-menu slot="overlay">
                    <a-menu-item key="1" @click="batchDel"><a-icon type="delete"/>删除</a-menu-item>
                </a-menu>
                <a-button style="margin-left: 8px"> 批量操作 <a-icon type="down" /></a-button>
            </a-dropdown> -->
        </div>

        <!-- table区域-begin -->
        <div>
            <!-- <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
                <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
                <a style="margin-left: 24px" @click="onClearSelected">清空</a>
            </div> -->
            <a-table
                ref="table"
                size="middle"
                :scroll="{x:1275}"
                bordered
                rowKey="id"
                :columns="columns"
                :dataSource="dataSource"
                :pagination="ipagination"
                :loading="loading"
                class="j-table-force-nowrap"
                @change="handleTableChange">
                <span slot="cxj_tjzt" slot-scope="text, record" style="display: flex;justify-content: space-between;align-items: center;">
                    <span>{{record.tjzt}}</span>
                    <img @click="handleEdit(record)" style="width:13px;height:14px;cursor:pointer;" src="../../assets/img/xszt.png" alt="">
                </span>
                <span slot="action" slot-scope="text, record">
                    <a @click="viewDetail(record)">查看</a>
                    <a @click="viewOptions(record)" style="margin-left: 10px;">查看意见</a>
                </span>
            </a-table>
        </div>
        <cxj-tj-tjyj-modal ref="modalForm" @ok="modalFormOk"></cxj-tj-tjyj-modal>
        <OptionModal :showFlag="showFlag" :cxj_cxj_id="cxj_cxj_id" />
    </a-card>
</template>

<script>
import Vue from 'vue'
import '@/assets/less/TableExpand.less'
import CxjTjTjyjModal from './modules/CxjTjTjyjModal'
import OptionModal from './CxjTjTjyjGlList/optionsModal'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { ACCESS_TOKEN } from "@/store/mutation-types"
export default {
    name: 'CxjTjTjyjGlList',
    mixins:[JeecgListMixin, mixinDevice],
    components: {
        CxjTjTjyjModal,
        OptionModal
    },
    data () {
        return {
            queryParam: {},
            description: '成果推荐表管理页面',
            // 表头
            columns: [
                {
                    title: '序号',
                    align: "center",
                    dataIndex: '',
                    width: 50,
                    customRender: function (t,r,index) {
                        return parseInt(index)+1;
                    }
                },
                {
                    title:'成果编号',
                    align:"center",
                    dataIndex: 'cxj_xmbh',
                    width: 100,
                },
                {
                    title:'成果名称',
                    dataIndex: 'cxj_mc_zw',
                    width: 220,
                },

                {
                    title:'成果类别',
                    align:"center",
                    dataIndex: 'fl_id',
                    customRender: function(id){
                        return id == 11 ? '技术成果': id == 21?'系统成果':id == 31?'标准成果':id==41?'信息化成果':id==61?'职工成果':id==51?'专利成果':'无类别'
                    },
                    width: 95,
                },
                {
                    title:'申报单位',
                    dataIndex: 'sbdw_qymc',
                    width: 220,
                },
              {
                title:'推荐单位',
                dataIndex: 'jttjdw_mc',
                width: 220,
              },
                {
                    title:'起始时间',
                    align:"center",
                    dataIndex: 'cxj_qssj',
                    width: 120,
                },
                {
                    title:'完成时间',
                    align:"center",
                    dataIndex: 'cxj_wcsj',
                    width: 120,
                },
                {
                    title:'完成人',
                    dataIndex: 'wcrlist',
                    width: 220,
                },

                // {
                //     title:'完成单位',
                //     align:"center",
                //     dataIndex: 'wcdwlist'
                // },
                {
                    title:'项目状态',
                    align:"center",
                    fixed: "right",
                    dataIndex: 'xmzt',
                    scopedSlots: { customRender: 'cxj_xmzt' },
                    width: 85,
                },
                {
                    title:'推荐状态',
                    align:"center",
                    fixed: "right",
                    dataIndex: 'tjzt',
                    scopedSlots: { customRender: 'cxj_tjzt' },
                    width: 85,
                },
                {
                    title: '操作',
                    dataIndex: 'action',
                    align: "center",
                    fixed: "right",
                    width: 150,
                    scopedSlots: { customRender: 'action' }
                }
            ],
            url: {
                list: "/cxj/cxjTjTjyj/cxjgl_cxjTjList_gly",
                delete: "/cxj/cxjTjTjyj/delete",
                deleteBatch: "/cxj/cxjTjTjyj/deleteBatch",
                exportXlsUrl: "/cxj/cxjTjTjyj/exportXls",
                importExcelUrl: "cxj/cxjTjTjyj/importExcel",
                sbdwUrl: '/cxj/cxjSbSbdw/cxjsb_getSbtjdw'
            },
            dictOptions:{},
            superFieldList:[],
            fileStatus: "",
            showFlag: false,
            cxj_cxj_id: ''
        }
    },
    created() {
        this.$set(this.dictOptions, 'isValid', [{text:'是',value:'Y'},{text:'否',value:'N'}])
        this.getSuperFieldList();
    },
    computed: {
        importExcelUrl: function(){
            return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
        },
    },

    beforeUpdate(){
        let nowTime = new Date().getTime();
        // let nowTime = 1628946457000;
        // console.log(nowTime)
        this.dataSource.map(item=>{
            item.type = 'gly';
        })
    },
    methods: {
        initDictConfig(){},
        getSuperFieldList(){
            let fieldList=[];
            fieldList.push({type:'string',value:'cxj_xmbh',text:'成果编号',dictCode:''})
            fieldList.push({type:'string',value:'cxj_mc_zw',text:'成果名称',dictCode:''})
            fieldList.push({type:'string',value:'fl_id',text:'成果类别',dictCode:''})
            fieldList.push({type:'string',value:'sbdw_qymc',text:'申报单位',dictCode:''})
            fieldList.push({type:'string',value:'jttjdw_mc',text:'推荐单位',dictCode:''})
            fieldList.push({type:'string',value:'cxj_qssj',text:'起始时间',dictCode:''})
            fieldList.push({type:'string',value:'cxj_wcsj',text:'完成时间',dictCode:''})
            fieldList.push({type:'string',value:'wcrlist',text:'完成人',dictCode:''})
            fieldList.push({type:'string',value:'wcdwlist',text:'完成单位',dictCode:''})
            fieldList.push({type:'string',value:'tjzt',text:'推荐状态',dictCode:''})
            fieldList.push({type:'string',value:'xmzt',text:'项目状态',dictCode:''})
            fieldList.push({type:'switch',value:'isValid',text:'是否有效'})
            this.superFieldList = fieldList;
        },
        viewDetail(item){
            console.log('成果推荐管理',item)
            let token = Vue.ls.get(ACCESS_TOKEN);
            sessionStorage.setItem('token', token);
             let routeData = this.$router.resolve({
                path: '/shenbao/declare',
                query: {
                    type: item.fl_id,
                    cxj_cxj_id: item.id,
                    isHead: 2,
                    from: 'gly',
                    cxj_xmbh: item.cxj_xmbh,
                    cxj_mc_zw: item.cxj_mc_zw

                }
            });
            window.open(routeData.href, '_blank');
        },
        viewOptions(record) {
            this.cxj_cxj_id = record.id;
            this.showFlag = !this.showFlag;
        },
    }
}
</script>
<style scoped lang="less">
    @import '~@assets/less/common.less';
    .table-operator {
        span {
            color: #252525;
            line-height: 20px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-size: 14px;
            display: inline-block;
            margin-right: 18px;
        }
    }
    /deep/.ant-table-thead > tr > th .ant-table-header-column {
      width:100%;
      text-align: center!important;
    }
    /deep/.ant-table-tbody > tr > td {
      word-break: break-all;
      white-space: normal;
      word-wrap:break-word;
      font-size:14px;
      padding:3px 3px!important;
    }
    /deep/.ant-table-tbody > tr > td span{
      font-size:14px;
    }
</style>